<template>
  <div>
    <div v-if="this.$store.state.listadd.length">
      <van-swipe-cell v-for="item in $store.state.listadd" :key="item.id">
        <van-checkbox v-model="item.check" @change="getNum"></van-checkbox>
        <van-card
          :price="item.price + '.00'"
          :title="item.name"
          class="goods-card"
          :thumb="item.pic"
        >
          <template #num>
            <van-stepper v-model="item.num" @change="getNum" />
          </template>
        </van-card>
        <template #right>
          <van-button
            square
            text="删除"
            type="danger"
            @click="del(item.id)"
            class="delete-button"
          />
        </template>
      </van-swipe-cell>
      <van-submit-bar
        :price="this.$store.getters.getprice"
        button-text="提交订单"
      >
        <van-checkbox v-model="checked" @click="add">全选</van-checkbox>
      </van-submit-bar>
    </div>
    <van-empty description="购物测已经饿憋了T.T" v-else>
      <van-button round type="danger" class="bottom-button" @click="gogo"
        >去逛逛</van-button
      >
    </van-empty>
  </div>
</template>

<script>
export default {
  name: "WorkspaceJsonShopcar",

  data() {
    return {
      checked: this.$store.getters.checked,
    };
  },

  mounted() {},

  methods: {
    gogo() {
      this.$router.push("/home");
    },
    del(id) {
      this.$store.commit("Savedel", id);
    },
    add() {
      this.$store.commit("Saveadd", { checked: this.checked });
    },
    getNum() {
      this.checked = this.$store.getters.checked;
      localStorage.haha = JSON.stringify(this.$store.state.listadd);
    },
  },
};
</script>

<style lang="less" scoped>
.goods-card {
  margin: 0;
  background-color: whitesmoke;
}

.delete-button {
  height: 100%;
}
.van-submit-bar {
  bottom: 45px;
}
</style>